import { Route, Switch, NavLink, Redirect } from 'react-router-dom'
import { Suspense } from 'react'
import {RouterItem} from "../types/index.d"

interface Routs{
    RouterList:RouterItem[]
}
let RouterView=(props:Routs)=>{
    let routerlist=props.RouterList&&props.RouterList.filter(item=> {return !item.to})
    let redirect=props.RouterList &&props.RouterList.filter(item=> {return item.to})[0]

    return (
        <Suspense fallback={<div>...loading</div>}>
              <Switch>
                   {
                      routerlist&&routerlist.map((item,index)=>{
                          return <Route key={index} path={item.path} render={(props)=>{
                                 return <item.component {...props} child={item.children}></item.component>
                          }}></Route>
                      })  
                   }
                   {
                       redirect? <Redirect from={redirect.path} to={redirect.to as string}></Redirect>:""
                   }
              </Switch>
        </Suspense>
    )
}

export default RouterView